<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">

<head>

    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>


    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link th:href="@{/css/font-awesome.css}" rel="stylesheet"/>
    <link th:href="@{/css/animate.css}" rel="stylesheet"/>
    <link th:href="@{/css/style.css}" rel="stylesheet"/>

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-6">
            <div class="ibox-content">
                <form class="form-horizontal m-t" id="commentForm">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">角色ID：</label>
                        <div class="col-sm-8">
                            <label class="form-control" id="roleId" th:text="${roles.roleId}"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">角色名称：</label>
                        <div class="col-sm-8">
                            <input id="curl" type="text" class="form-control" name="roleName"
                                   th:value="${roles.roleName}" maxlength="10"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">角色描述：</label>
                        <div class="col-sm-8">
                            <input id="cur2" type="text" class="form-control" name="roleMemo"
                                   th:value="${roles.roleMemo}" maxlength="140"/>
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-sm-4 col-sm-offset-3">
                            <input class="btn btn-primary" type="button" onclick="upload()" value="提交"></input>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>


<!-- 全局js -->
<script th:src="@{/js/jquery.min.js?v=2.1.4}"></script>
<script th:src="@{/js/bootstrap.min.js?v=3.3.6}"></script>
<script th:src="@{/js/plugins/layer/layer.min.js}"></script>

<!-- 自定义js -->
<script th:src="@{/js/content.js?v=1.0.0}"></script>

<!-- jQuery Validation plugin javascript-->
<script th:src="@{/js/plugins/validate/jquery.validate.min.js}"></script>
<script th:src="@{/js/plugins/validate/messages_zh.min.js}"></script>

<script th:src="@{/js/demo/form-validate-demo.js}"></script>
<!-- Input Mask-->
<script th:src="@{/js/plugins/jasny/jasny-bootstrap.min.js}"></script>

<script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>

<script>
    function upload() {

        var role = {
            roleId: $("#roleId").text(),
            roleName: $("input[name='roleName']").val(),
            roleMemo: $("input[name='roleMemo']").val()
        };

        $.ajax({
            type: "POST",
            url: "roleUpdate.shtml",
            async: false,
            data: role,
            success: function (data) {
                if (data == "t") {
                    layer.msg("修改成功!");
                    setTimeout(function () {
                        parent.location.reload();
                        var index = parent.layer.getFrameIndex(window.name);
                        parent.close(index);
                    }, 1000)

                } else if (data == "f") {
                    layer.msg("修改失败");
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                layer.msg("修改失败");
            }

        });
        layer.close();
    }
</script>
</body>

</html>
